<%@page import="java.util.*"%>
<%@page import="java.text.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%
    String path = request.getContextPath(); 
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+path+ "/"; 
    
	String nums = (String)request.getAttribute("nums");
%>
<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<title>视频列表</title>
	<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.min.css" />
	<link rel="stylesheet" href="css/bootstrap-datetimepicker.css" />
    <link rel="stylesheet" href="bootstrap-table/dist/bootstrap-table.css">
    
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/font.css">
    
    <link rel="stylesheet" href="./css/x-admin.css" media="all">
</head>
<body>
<div class="x-nav">
     <!--  <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a> -->
    </div>
    <div class="x-body">
       <form class="layui-form x-center" action="" style="width:100%">
                <div class="layui-form-pane" style="margin-top: 15px;">
                  <div class="layui-form-item">
                  
                    <label class="layui-form-label">日期</label>
                    <div class="layui-input-inline">
                      <input class="layui-input" placeholder="开始时间" id="LAY_demorange_s">
                    </div>
                    <div class="layui-input-inline">
                      <input class="layui-input" placeholder="结束时间" id="LAY_demorange_e">
                    </div>
                    
                    <!-- <label class="layui-form-label">上下架</label>
                    <div class="layui-input-inline">
                        <select name="cname" id="status">
                            <option value="">请选择</option>
                            <option value="100">上架</option>
                            <option value="101">下架</option>
                        </select>
                    </div> -->
                    
                    <label class="layui-form-label" style="width: 110px">视频名称</label>
                    <div class="layui-input-inline">
                      <input type="text" name="title"  id="courseName"  placeholder="视频名称" autocomplete="off" class="layui-input">
                    </div>
                    
                    <div class="layui-input-inline" style="width:80px">
                        <button type="button" id="queryBtn" onclick="doQuery();" class="layui-btn"><i class="layui-icon">&#xe615;</i></button>
                    </div>
                  </div>
                </div> 
            </form>
      <xblock>
       <button class="layui-btn" onclick="admin_add('添加视频','jsp/videoManager/addChartper.jsp','600','')"><i class="layui-icon">&#xe608;</i>新增</button>
       <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<!--        <button class="layui-btn layui-btn-danger" onclick="exports()"><i class="layui-icon">&#xe629;</i>导出</button> -->
		<button  class="layui-btn layui-btn-danger" onclick="mobang()">下载模板</button>
 	  <form action="video/readExcelVideo" method="post"
			enctype="multipart/form-data">
			<input type="submit" value="导入" class="layui-btn layui-btn-danger">&nbsp;&nbsp;&nbsp;<%-- <label style="color: red">  ${ReturnData.msg}</label> --%>
			<input type="file" name="excelFile" class="form-control">
	  </form>
      </xblock>  
      </div>
	  <div class="container" style="width: 100%">
	        <table id="demo-table">
	        </table>
	  </div>
</body>
	<!-- 加载需要的js -->
	<script src="js/jquery-3.2.1.min.js"></script>
	<script src="js/common2.js"></script>
	<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
	<script src="js/jquery-bootstrap-pagination.js"></script>
    <script type="text/javascript" src="lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="js/xadmin.js"></script>
	<script src="js/qunit-1.11.0.js"></script>
	<script src="js/bootstrap-datetimepicker.js"></script>
	<script src="js/bootstrap-datetimepicker.zh-CN.js"></script>
	<script src="js/jquery.md5.js"></script>
	<script src="bootstrap-table/dist/bootstrap-table.min.js"></script>
	<script src="bootstrap-table/dist/locale/bootstrap-table-zh-CN.min.js"></script>
	<script src="js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>
	
	<script src="lib/layui/layui.js" charset="utf-8"></script>
    <script src="js/x-layui.js" charset="utf-8"></script>
	<script type="text/javascript" charset="utf-8">

	$(function () {
	    initTable();
	    var nums = <%=nums%>;
	    if(nums != null){
	    	alert("成功导入" + nums + "条数据！")
	    }
	});

	function mobang(){
		location.href="视频导入.xls";
	}
	
	function doQuery(params){
	    $('#demo-table').bootstrapTable('refresh');    //刷新表格
	}

	function initTable(){
	    var url = "video/selectVideoList";
	    $('#demo-table').bootstrapTable({
	        method:'GET',
	        dataType:'json',
	        contentType: "application/x-www-form-urlencoded",
	        cache: false,
	        striped: true,                              //是否显示行间隔色
	        sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
	        url:url,
	        height: $(window).height() - 110,
	        width:$(window).width(),
	        showColumns:true,
	        pagination:true,
	        queryParams : queryParams,
	        minimumCountColumns:2, 
	        pageNumber:1,                       //初始化加载第一页，默认第一页
	        pageSize:10,                       //每页的记录行数（*）
	        pageList: [10, 20, 30, 50],        //可供选择的每页的行数（*）
	        uniqueId: "id",                     //每一行的唯一标识，一般为主键列
	        exportDataType: 'all',
	        responseHandler: responseHandler,
	        columns: [
	        	{ field: '', title: '序列', checkbox:true },
		        {
		            field : 'G_LESSON_NAME',
		            title : '视频名称',
		            align : 'center',
		            valign : 'middle'
		           
		        },
	            {
		            field : 'G_LESSON_MONEY',
		            title : '价格',
		            align : 'center',
		            valign : 'middle',
		            formatter: function (value, row, index) {
		            	 console.log(value);
			            	var s="";
			            	if(value==0){
			            		s="免费";
			            	}else{
			            		s="￥"+value;
			            	}
		                  return s;
		             }
		        },
		       	{
		            field : 'G_LESSON_INTEGEAL',
		            title : '视频积分',
		            align : 'center',
		            valign : 'middle',
		        },
		       	{
		            field : 'G_LESSON_DURATION',
		            title : '视频时长',
		            align : 'center',
		            valign : 'middle',
		            formatter : function (value, row, index){
		                return value + "秒";
		            }  
		        },
		       	{
		            field : 'video_size',
		            title : '视频大小',
		            align : 'center',
		            valign : 'middle',
		        },
		       	{
		            field : 'get_integral',
		            title : '可得积分',
		            align : 'center',
		            valign : 'middle',
		        },
		       	{
		            field : 'get_growth_value',
		            title : '可得成长值',
		            align : 'center',
		            valign : 'middle',
		        },
		       	{
		            field : 'teacher_name',
		            title : '视频讲师',
		            align : 'center',
		            valign : 'middle',
		        },
		        {
		            field : 'G_CREATETIME',
		            title : '添加时间',
		            align : 'center',
		            valign : 'middle',
		            formatter : function (value, row, index){
		                return  timeStamp2String(value);
		            }   
		        },
		        {
		            field : 'upId',
		            title : '操作',
		            align : 'center',
		            valign : 'middle',
		            formatter: operateFormatter //自定义方法，添加操作按钮
		        }
		        ]
		    });
	}
	
	function operateFormatter(value, row, index) {//赋予的参数
		console.log(row);
		return [
			'<button class="layui-btn "  onclick="banner_show(\''+ row.G_ID + '\')"> <i class="layui-icon">&#xe642;</i>查看</button>',
			'<button  class="layui-btn"  onclick="banner_edit(\''+ row.G_ID + '\')"><i class="layui-icon">&#xe604;</i>编辑</button>',
			].join('');
    } 
	
	layui.use(['form','laydate','element','laypage','layer'], function(){
        $ = layui.jquery;//jquery
      laydate = layui.laydate;//日期插件
      lement = layui.element();//面包导航
      laypage = layui.laypage;//分页
      layer = layui.layer;//弹出层
      form = layui.form();
 }); 
	//批量删除
	function delAll() {
	    //获取所有被选中的记录
	    var rows = $("#demo-table").bootstrapTable('getSelections');
	    if (rows.length== 0) {
	    	layer.msg('请至少选择一个被删除项!',{icon:2,time:2000});	
	        return;
	    }
	    var ids = '';
	    for (var i = 0; i < rows.length; i++) {
	        ids += rows[i]['G_ID'] + ",";
	    }
	    ids = ids.substring(0, ids.length - 1);
	    deleteUser(ids);
	}
	
	function deleteUser(ids) {
		layer.confirm('确认要删除吗？',function(index){
            //发异步删除数据
			$.ajax({
	            url: "video/deleteVideo",
	            type: "post",
	            data: {
	                id:ids
	            },
	            success: function(data) {
	            	if(data.code==200){
				 		layer.msg('已删除!',{icon:1,time:3000});				 		
				 		//location.reload();
				 		window.location.replace("jsp/videoManager/videoList.jsp")
			 		}else{
			 			layer.msg('删除失败!',{icon:2,time:3000});			
			 		}
			 	} 
	        });
        });
	}
	
    // 查看
    function banner_show (id) {
   	 x_admin_show('查看视频','video/selectVideoList?id=' + id,'600','');
    }
	   
	function responseHandler(res) { 
		console.log(res);
	    if (res) {
	        return {
	            "rows" : res.data,
	            "total" : res.totalRecord
	        };
	    } else {
	        return {
	            "rows" : [],
	            "total" : 0
	        };
	    }
	}
	
	function queryParams(params) {
		var param = {    		
	    		startTime:$("#LAY_demorange_s").val(),
		    	endTime : $("#LAY_demorange_e").val(),
		    	courseName:$("#courseName").val(),
	        limit : this.limit, // 页面大小
	        offset : this.offset, // 页码
	        pageNumber : this.pageNumber,
	        pageSize : this.pageSize
	    }
	    return param;
	} 
	//初始化弹出框
	$(function () {
	  	$('[data-toggle="popover"]').popover()
	});
	
	 //时间格式化
   	function timeStamp2String(time){
   	    var datetime = new Date();
   	    datetime.setTime(time);
   	    var year = datetime.getFullYear();
   	    var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
   	    var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
   	    var hour = datetime.getHours()< 10 ? "0" + datetime.getHours() : datetime.getHours();
   	    var minute = datetime.getMinutes()< 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
   	    var second = datetime.getSeconds()< 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
   	    return year + "-" + month + "-" + date+" "+hour+":"+minute+":"+second
   	}
	 
    layui.use(['laydate','element','laypage','layer'], function(){
        $ = layui.jquery;//jquery
      laydate = layui.laydate;//日期插件
      lement = layui.element();//面包导航
      laypage = layui.laypage;//分页
      layer = layui.layer;//弹出层

      //以上模块根据需要引入
      var start = {
        min: '2000-01-01 00:00:00'
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,choose: function(datas){
          end.min = datas; //开始日选好后，重置结束日的最小日期
          end.start = datas //将结束日的初始值设定为开始日
        }
      };
      
      var end = {
        min: '2000-01-01 00:00:00'
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,choose: function(datas){
          start.max = datas; //结束日选好后，重置开始日的最大日期
        }
      };
      
      document.getElementById('LAY_demorange_s').onclick = function(){
        start.elem = this;
        laydate(start);
      }
      document.getElementById('LAY_demorange_e').onclick = function(){
        end.elem = this
        laydate(end);
      }
      
    });

    /*添加*/
    function admin_add(title,url,w,h){
        x_admin_show(title,url,w,h);
    }
    
 	// 编辑
    function banner_edit (id) {
   	 x_admin_show('编辑视频','video/selectVideoList?id=' + id + "&type=1",'600','');
    }
    </script>
</body>
</html>